Effects


The Extended Standard Components in the ICEfaces Component Suite provide special attributes that can be used to invoke effects on the components, such as fade, highlight, pulsate, and move. Effects can either be server-initiated (Server) or client-initiated (Local). Server effects are invoked by dynamically changing the value of the 'effect' attribute on a component, usually by binding the attribute to a backing bean. Local effects are invoked by client-side browser events, such as "onMouseOver" or "onClick".

Effects can be used to provide a richer user-interface experience to the user by dynamically manipulating components in interesting ways.

Effects are located in the com.icesoft.faces.context.effects package.
Example

The following code shows a outputText with a server effect:

<ice:outputText effect="#{bean.effect}"/>

The following code shows a outputText with a local effect:

<ice:outputText onmouseovereffect="#{bean.effect}"/>

Effect Types

Effect
Description
Highlight
Highlight a component to a selected color and then fade to the original color.
Appear
Fade in a component from invisible, to 100% opacity
Fade
Fade out a component to invisible from 100% opacity
Pulsate
Flash a component for a few seconds
Move
Move a component to a new location
Scale
Grow or Shrink a panel group by a specified percentage
Puff
Expand and fade a panel group
Blind Up
Roll up a panel group like a blind until it is hidden
Blind Down
Roll down a panel group like a blind from hidden to actual size
Switch Off
Pulsate once and then fold a panel group into itself
Drop Out
Drop a panel group off of the screen
Shake
Move from side to side
Slide Down
Slide a panel group down
Slide Up
Slide a panel group up
Squish
Squish a panel group off of the screen
Grow
Grow a panel group from nothing to its full size
Shrink
Shrink a panel group until it is no longer visible
Fold
Fold a panel group from the bottom up to the top and then fold in the sides